import { BasicDrawer, useDrawerInner, useDrawer } from "@/components/Drawer";
import { BasicForm, FormSchema, useForm } from "@/components/Form";
import { OldSuplerApi } from "@/api/erp/purchase/oldSupler";
import { message } from "antd";
import { useTranslation } from "react-i18next";
import { useState, useMemo } from "react";
import { SuplerGroupApi } from "@/api/erp/purchase/suplerGroup";
import ContractNoTable from "./getContractNoTable";
import SuplerListTable from "./getSuplerListTable";
let reload: Function;
let id: any;
const index = (props: { register: Fn }) => {
	const [isUpdated, setIsUpdated] = useState(false);
	const { t } = useTranslation();
	const en_vi = "drugStorage.purchasingManagement.other";
	const formSchema: FormSchema[] = [
		{
			label: t(`${en_vi}.suplerId`),
			field: "suplerId",
			component: "InputSearch",
			componentProps: {
				onSearch: () => openSuplerListTable(true)
			}
		},
		{
			label: t(`${en_vi}.suplerName`),
			component: "Input",
			field: "suplerName",
			componentProps: {
				disabled: true
			}
		},
		{
			label: t(`${en_vi}.bankAccount`),
			field: "bankAccount",
			component: "Input",
			componentProps: {
				disabled: true
			}
		},
		{
			label: t(`${en_vi}.taxId`),
			field: "taxId",
			component: "Input",
			componentProps: {
				disabled: true
			}
		},
		{
			label: t(`${en_vi}.address`),
			field: "address",
			component: "Input",
			componentProps: {
				disabled: true
			}
		},
		{
			label: t(`${en_vi}.phoneNumber`),
			field: "phoneNumber",
			component: "Input",
			componentProps: {
				disabled: true
			}
		},
		{
			label: t(`${en_vi}.bankName`),
			field: "bankName",
			component: "Input",
			componentProps: {
				disabled: true
			}
		},
		{
			label: t(`${en_vi}.categoryId`),
			component: "ApiSelect",
			field: "categoryId",
			componentProps: {
				api: SuplerGroupApi.getSuplerGroupPage,
				labelField: "name",
				valueField: "id",
				immediate: false
			}
		},
		{
			label: t(`${en_vi}.contractNo`),
			field: "contractNo",
			component: "InputSearch",
			componentProps: {
				onSearch: () => openContractNoTable(true)
			}
		},
		{
			label: t(`${en_vi}.contractDate`),
			field: "contractDate",
			component: "DatePicker"
		},
		{
			label: t(`${en_vi}.parentId`),
			component: "ApiSelect",
			field: "parentId",
			componentProps: {
				api: OldSuplerApi.getOldSuplerPage,
				labelField: "suplerName",
				valueField: "suplerId",
				immediate: false
			}
		},
		{
			label: t(`${en_vi}.representName`),
			field: "representName",
			component: "Input"
		},
		{
			label: t(`${en_vi}.hideFlag`),
			field: "hideFlag",
			component: "Select",
			componentProps: {
				options: [
					{
						label: t("felix_ui.open"),
						value: 0
					},
					{
						label: t("felix_ui.close"),
						value: 1
					}
				]
			}
		},
		{
			label: t(`${en_vi}.sqNumb`),
			field: "sqNumb",
			component: "InputNumber"
		},
		{
			label: t(`${en_vi}.accountCode`),
			field: "accountCode",
			component: "InputNumber"
		},
		{
			label: t(`${en_vi}.balance`),
			field: "balance",
			component: "InputNumber"
		},
		{
			label: t(`${en_vi}.settledAmount`),
			field: "settledAmount",
			component: "InputNumber"
		},
		{
			label: t(`${en_vi}.shortName`),
			field: "shortName",
			component: "InputNumber"
		}
	];
	const getTitle = useMemo(() => {
		return isUpdated ? t("felix_ui.edit") : t("felix_ui.add");
	}, [isUpdated]);
	const [register, { validateFields, setFieldsValue, resetFields, setFieldValue }] = useForm({
		schemas: formSchema,
		labelWidth: 150,
		baseColProps: {
			span: 12
		}
	});
	const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(props.register, data => {
		reload = data.reload;
		id = data.record?.id;
		resetFields();
		setDrawerProps({ confirmLoading: true });
		setIsUpdated(!!data?.isUpdated);
		setFieldsValue({
			...data.record
		});
		setDrawerProps({ confirmLoading: false });
	});
	const handleSubmit = async () => {
		const formValue = await validateFields();
		formValue.contractDate = new Date(formValue.contractDate).getTime();
		let res;
		if (isUpdated) {
			formValue.id = id;
			res = await OldSuplerApi.updateOldSupler(formValue);
		} else {
			res = await OldSuplerApi.createOldSupler(formValue);
		}
		if (!res) {
			message.error(t("viewComponents.patientInformation.additionFailed"));
			return;
		}
		message.success(t("viewComponents.patientInformation.successfullyAdded"));
		closeDrawer();
		reload();
	};
	const [drawerContractNoTable, { openDrawer: openContractNoTable }] = useDrawer();
	const [drawerSuplerListTable, { openDrawer: openSuplerListTable }] = useDrawer();
	const setContractNo = (contractNo: number) => {
		setFieldValue("contractNo", contractNo);
	};
	const setSuplerList = (SuplerList: any) => {
		setFieldsValue({ ...SuplerList, suplerName: SuplerList.name });
	};
	return (
		<>
			<BasicDrawer size="large" title={getTitle} showFooter={true} {...props} register={registerDrawer} ok={handleSubmit}>
				<BasicForm register={register} labelWrap={true}></BasicForm>
			</BasicDrawer>
			<ContractNoTable register={drawerContractNoTable} setContractNo={setContractNo}></ContractNoTable>
			<SuplerListTable register={drawerSuplerListTable} setSuplerList={setSuplerList}></SuplerListTable>
		</>
	);
};
export default index;
